﻿@using System.Configuration
@{
    ViewBag.Title = "Quản Lý Đơn Mượn Sách";
    Layout = "~/Views/Shared/_Admin_Layout.cshtml";
}

@section CssImport
{
    <style>
        .child-opener-image
        {
            cursor: pointer;
        }
        .child-opener-image-column
        {
            text-align: center;
        }
        .jtable-dialog-form
        {
            min-width: 220px;
        }
        .jtable-dialog-form input[type="text"]
        {
            min-width: 200px;
        }
    </style>
}
<div id="div-main-menu" class="left-side-bar">
    @Html.Partial("_AdminMenu")
</div>
<div id="div-main-content" class="right-side-bar">
    <h2>QUẢN LÝ ĐƠN MƯỢN SÁCH</h2>
    <div class="filtering">
        <label>Mã sinh viên: </label><input type="text" name="studentCode" id="studentId" />
        <label>Nhân viên: </label>@Html.DropDownList("lenderId", (IEnumerable<SelectListItem>)ViewBag.Employees, new { id = "IDEmp" })        
        <button type="submit" id="LoadRecordsButton">Tìm kiếm</button>
    </div>
    <div id="LibraryBorrowContainer"></div>
    <script type="text/javascript">

    $(document).ready(function () {
        $('#LibraryBorrowContainer').jtable({
            title: 'Borrows List',
            paging: true, //Enable paging
            pageSize: @ConfigurationManager.AppSettings["PageSize"],
            sorting: true, //Enable sorting
            defaultSorting: 'StudentID ASC',
            //openChildAsAccordion: true, //Enable this line to show child tabes as accordion style
            actions: {
                listAction: '@Url.Action("GetBorrowingList", "Borrowing")',
                deleteAction: '@Url.Action("DeleteBorrowing","Borrowing")',
                updateAction: '@Url.Action("UpdateBorrowing", "Borrowing")',
                createAction: '@Url.Action("AddBorrowing", "Borrowing")'
            },
            fields: {
                ID: {
                    title: 'Mã',
                    key: true,
                    create: false,
                    edit: false,
                },
                BorrowDetailList:{
                    title: ' ',
                    sorting: false,
                    edit: false,
                    create: false,
                    listClass: ' ',
                    display: function (BorrowDetailData) {
                        //Create an image that will be used to open child table
                        var $img = $('<img class="child-opener-image" src="/Content/images/Misc/note.png" title="Borrow Detail List" />');
                        //Open child table when user clicks the image
                        $img.click(function () {
                            $('#LibraryBorrowContainer').jtable('openChildTable',
                                    $img.closest('tr'),
                                    {
                                        title: 'Mã Mượn Sách: ' + BorrowDetailData.record.ID,
                                        actions: {
                                            listAction: '@Url.Action("GetBorrowingDetailList","BorrowingDetail")?ID=' + BorrowDetailData.record.ID,
                                            deleteAction: '@Url.Action("DeleteBorrowingDetail","BorrowingDetail")',
                                            updateAction: '@Url.Action("UpdateBorrowingDetail", "BorrowingDetail")',
                                            createAction: '@Url.Action("AddBorrowingDetail", "BorrowingDetail")'
                                        },
                                        fields: {
                                            ID: {
                                                key: true,
                                                create: false,
                                                edit: false,
                                                type: 'hidden',                                             
                                            },
                                            BorrowingID: {
                                                title: 'Mã mượn sách',
                                                defaultValue: BorrowDetailData.record.ID,
                                                type: 'hidden'                                                
                                            },
                                            BookID: {
                                                title: 'Tên sách',
                                                options: '@Url.Action("BookOptions","Book")'                        
                                            },
                                            Quantity: {
                                                title: 'Số lượng mượn'
                                            },                                         
                                        }
                                    },
                                     function (data) { //opened handler
                                        data.childTable.jtable('load');
                                    });
                        });
                        //Return image to show on the person row
                        return $img;
                    }
                },
                StudentID: {
                    title: 'Mã SV',
                    options: '@Url.Action("StudentOptions","Student")'
                },
                LenderID: {
                    title: 'Người cho mượn sách',
                    create: false,
                    edit: false,
                    options: '@Url.Action("EmployeeOptions","Employee")'
                },
                BorrowedDate: {
                    title: 'Ngày mượn',
                    type: 'date',
                    displayFormat: 'yy-mm-dd'
                },
                ReturnedDate: {
                    title: 'Ngày trả',
                    type: 'date',
                    displayFormat: 'yy-mm-dd'
                },
                IsAccepted: {
                    title: 'Xác nhận mượn sách',
                    type: 'checkbox',
                    values: { 'false': 'Chưa chấp nhận', 'true': 'Đã chấp nhận' },
                    defaultValue: 'false'
                },
                IsReturned: {
                    title: 'Xác nhận trả sách',
                    type: 'checkbox',
                    values: { 'false': 'Chưa trả sách', 'true': 'Đã trả sách' },
                    defaultValue: 'false'
                }                       
            },
            //validate cac field trong bang Libraty_Books
            formCreated: function (event, data) {
                data.form.find('input[name="BorrowedDate"]').addClass('validate[required, custom[date]]');
                data.form.find('input[name="ReturnedDate"]').addClass('validate[required,custom[date]]');
                
                data.form.validationEngine();
            },
            formSubmitting: function (event, data) {
                return data.form.validationEngine('validate');
            },
            formClosed: function (event, data) {
                data.form.validationEngine('hide');
                data.form.validationEngine('detach');
            },
        });

        //Load person list from server
        $('#LoadRecordsButton').click(function (e) {
            e.preventDefault();
            $('#LibraryBorrowContainer').jtable('load', {
                lenderId: $('#IDEmp').val(),
                studentCode: $('#studentCode').val(),              
            });
        });

        //Load all records when page is first shown
        $('#LoadRecordsButton').click();
    });
</script>
</div>
<div style="clear: both"></div>